﻿@{
    ViewBag.Title = "GoHotel";
    Layout = "~/Views/Shared/_UserLayout.cshtml";
}
@model RBS.Core.Model.Hotel.H_Hotels
<!--列表-->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
 
<style type="text/css">
    body, html {
        width: 100%;
        height: 100%;
        margin: 0;
        font-family: "微软雅黑";
    }

    #allmap {
        height: 500px;
        width: 100%;
    }

    #r-result {
        width: 100%;
        font-size: 14px;
    }
</style>
<script>
    
    $(function () {
        //初始化 
        $(".content-tab-ul-wrap li").each(function (index) {
            $(this).click(function () {
                $(".content-tab-ul-wrap li a").removeClass("selected");
                $(this).find("a").addClass("selected"); 
                /*  if (index == 0) {
                    $(this).delegate('a', 'click', function () { gongjiao(); });
                 
                } else {
                    $(this).delegate('a', 'click', function () { jiache(); }); 
                } */
                $(".ss").hide();
                $(".ss").eq(index).show();
                $(".bb").hide();
                $(".bb").eq(index).show();
            });
        });
     
    });
</script>
<div class="content-tab-wrap">
    <div id="floatHead" class="content-tab">
        <div class="content-tab-ul-wrap">
            <ul >
                <li><a href="javascript:;"  class="selected">公交</a></li>
                <li><a href="javascript:;"  >驾车</a></li>
            </ul>
        </div>
    </div>
</div> 
<div class="tab-content"  > 
    <div id="r-search">
        <select class="ss select" id="gongjiaselect">
			<option value="0">最少时间</option>
			<option value="1">最少换乘</option>
			<option value="2">最少步行</option>
			<option value="3">不乘地铁</option>
		</select>
        <select  class="ss select" id="jiacheselect" style="display: none">
            <option value="0">最少时间</option>
            <option value="1">最短距离</option>
            <option value="2">避开高速</option>
        </select>
        从:
        <input id="start" type="text"    class = "input normal"/>
        <div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none; text-align: left"></div>
        </br>
        到:
        <input id="end" type="text"  class = "input normal" value="@Model.Address" /> 
        <input type="button" value="公交" class="bb btn" id="result" onclick="gongjiao()" />
        <input type="button" value="驾车" class="bb btn" style="display: none" onclick="jiache()" />
    </div>
</div>

<div> 
    <div id="allmap"></div>
    <div id="r-result"></div>
</div>
<script type="text/javascript">
    function G(id) {
        return document.getElementById(id);
    }
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(@ViewBag.lng, @ViewBag.lat);
    map.centerAndZoom(point, 14);
    map.enableScrollWheelZoom(true);
   
    var marker = new BMap.Marker(point);  // 创建标注
    map.addOverlay(marker);               // 将标注添加到地图中
    marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
    
    //出发点坐标提示
    var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
        {
            "input": "start"
            , "location": map
        }); 
    ac.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
        var str = "";
        var _value = e.fromitem.value;
        var value = "";
        if (e.fromitem.index > -1) {
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

        value = "";
        if (e.toitem.index > -1) {
            _value = e.toitem.value;
            value = _value.province + _value.city + _value.district + _value.street + _value.business;
        }
        str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
        G("searchResultPanel").innerHTML = str;
    }); 
    var myValue;
    ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
        var _value = e.item.value;
        myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
        G("searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
        setPlace();
    });
    function setPlace() {
        map.clearOverlays();    //清除地图上所有覆盖物
        function myFun() {
            var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
            map.centerAndZoom(pp, 18);
            map.addOverlay(new BMap.Marker(pp));    //添加标注
        }
        var local = new BMap.LocalSearch(map, { //智能搜索
            onSearchComplete: myFun
        });
        local.search(myValue);
    }
/*
    document.getElementById("longitude").value = "121.60814369685";
    document.getElementById("latitude").value = "31.278470617953";
    theLocation();
    // 用经纬度设置地图中心点
    function theLocation() {
        if (document.getElementById("longitude").value != "" && document.getElementById("latitude").value != "") {
            map.clearOverlays();
            var new_point = new BMap.Point(document.getElementById("longitude").value, document.getElementById("latitude").value);
            var marker = new BMap.Marker(new_point);  // 创建标注
            map.addOverlay(marker);              // 将标注添加到地图中
            map.panTo(new_point);
        }
    }
    //坐标拾取
    map.addEventListener("click", function (e) {
        alert(e.point.lng + "," + e.point.lat);
        document.getElementById("longitude").value = e.point.lng;
        document.getElementById("latitude").value = e.point.lat;
        theLocation();
    });*/

    //路线
    
    //公交
    
 /*   var start = document.getElementById("start").value;
    var end = document.getElementById("end").value;
    var routePolicy = [BMAP_TRANSIT_POLICY_LEAST_TIME, BMAP_TRANSIT_POLICY_LEAST_TRANSFER, BMAP_TRANSIT_POLICY_LEAST_WALKING, BMAP_TRANSIT_POLICY_AVOID_SUBWAYS];  
    var transit = new BMap.TransitRoute(map, {
        renderOptions: { map: map },
        policy: 0
    });
 
    $("#result").click(function () {
         
        map.clearOverlays();
        var i = $("#gongjiaselect").val();
        alert(i);
        search(start, end, routePolicy[i]);
        function search(start, end, route) {
            transit.setPolicy(route);
            transit.search(start, end);
        }
    });*/
     
    function gongjiao() { 
        var start = document.getElementById("start").value;
        var end = document.getElementById("end").value;
        var routePolicy = [BMAP_TRANSIT_POLICY_LEAST_TIME, BMAP_TRANSIT_POLICY_LEAST_TRANSFER, BMAP_TRANSIT_POLICY_LEAST_WALKING, BMAP_TRANSIT_POLICY_AVOID_SUBWAYS]; 

        var i = $("#gongjiaselect").val();
        
        /*var transit = new BMap.TransitRoute(map, {
            renderOptions: { map: map, panel: "r-result" },
            policy: 0
        });  */
        map.clearOverlays();
        var transit = new BMap.TransitRoute(map, {
            renderOptions: { map: map, panel: "r-result" },
            onResultsHtmlSet: function () { $("#r-result").show() }
        });
        transit.setPolicy(routePolicy[i]);
        transit.search(start, end);
      /*  search(start, end, routePolicy[i]);
        function search(start, end, route) {
            transit.setPolicy(route);
            transit.search(start, end);
        } */
    } 
    function jiache() {
        var start = document.getElementById("start").value;
        var end = document.getElementById("end").value;
        var routePolicy = [BMAP_DRIVING_POLICY_LEAST_TIME, BMAP_DRIVING_POLICY_LEAST_DISTANCE, BMAP_DRIVING_POLICY_AVOID_HIGHWAYS]; 
      //  map.clearOverlays();
        var i = $("#jiacheselect").val();
        search(start, end, routePolicy[i]);
        function search(start, end, route) {
            /*var driving = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true }, policy: route });
                driving.search(start, end);*/
                
            var driving = new BMap.DrivingRoute(map, { renderOptions: { map: map, panel: "r-result", autoViewport: true }, policy: route });
            driving.search(start, end);
        }
      

    }
   
</script>
